"use strict";
import * as React from 'react';
const { View, FlatList, TouchableOpacity } = require('react-native');
const { WhiteSpace } = require('antd-mobile');
import { autoSize, commonProps, commonStyles } from "../../assets/styles/common";
const { connect } = require('react-redux');
const NavigationBar = require('react-native-navbar').default;
const { Actions } = require('react-native-router-flux');
import SearchBar from "../../component/SearchBar";
import NavBackButton from "../../component/BackButton";
import SearchResultItem from "./SearchResultItem";
import MySegmentControl from "../../component/MySegmentControl.ios";
import Request from "../../utils/Request";
class Page extends React.Component {
    constructor(props, context) {
        super(props, context);
        this.onSearch = (e) => {
            if (e.nativeEvent.text) {
                this.props.dispatch({
                    type: 'search/fetchData',
                    payload: { word: e.nativeEvent.text }
                });
            }
        };
        this.onChange = (index) => {
            this.setState({ selectedIndex: index });
        };
        this.onItemPress = (data, type) => {
            switch (type) {
                case 0:
                    {
                        Actions.userProfile({ userInfo: data });
                    }
                    break;
                case 1:
                    break;
                case 2:
                    break;
                case 3:
                    {
                        Actions.groupDetail({ title: data.groupName, groupItem: data });
                    }
                    break;
            }
        };
        this.getDataSource = () => {
            switch (this.state.selectedIndex) {
                case 0:
                    return this.props.search.member;
                case 1:
                    return this.props.search.companies;
                case 2:
                    return this.props.search.activities;
                case 3:
                    return this.props.search.groups;
            }
        };
        this.renderHeader = () => {
            return (<View>
                <View style={{ padding: 15 }}>
                    <MySegmentControl values={["会员", "公司", "活动", "群组"]} height={autoSize(29)} onChange={this.onChange} selectedIndex={0}/>
                </View>
                
                
                
                
                
                
            </View>);
        };
        this.renderItem = ({ item, index }) => {
            switch (this.state.selectedIndex) {
                case 0: {
                    const member = item;
                    return <SearchResultItem avatar={{ uri: Request.checkImageUrl(member.avatar) + '' }} name={member.nickName} sub={`${member.duty ? member.duty : ''} at ${member.company.name}`} detail={member.company.address} onPress={this.onItemPress.bind(this, member, 0)}/>;
                }
                case 1: {
                    const com = item;
                    return <SearchResultItem avatar={{ uri: com.pic }} name={com.name} sub={com.business} detail={com.address} onPress={this.onItemPress.bind(this, com, 1)}/>;
                }
                case 2: {
                    const com = item;
                    return <SearchResultItem avatar={{ uri: com.mainPic }} name={com.groupName} sub={com.description} detail={''} onPress={this.onItemPress.bind(this, com, 2)}/>;
                }
                case 3: {
                    const group = item;
                    return <SearchResultItem avatar={{ uri: group.mainPic }} name={group.groupName} sub={group.description} detail={''} onPress={this.onItemPress.bind(this, group, 3)}/>;
                }
            }
            return null;
        };
        this.state = {
            dataSource: [],
            selectedIndex: 0,
        };
    }
    render() {
        return (<View style={commonStyles.container}>
                <NavigationBar {...commonProps.navBar} leftButton={<NavBackButton icon={{ name: 'icon-cha1', color: '#999999', size: 20 }}/>} title={<SearchBar placeholder="探索会员圈" leftButtonWidth={50} rightButtonWidth={0} onSubmitEditing={this.onSearch}/>}/>
                <FlatList data={this.getDataSource()} renderItem={this.renderItem} ListHeaderComponent={this.renderHeader} keyboardDismissMode='on-drag' keyExtractor={(item, index) => item.id} extraData={this.state} ItemSeparatorComponent={() => <WhiteSpace />}/>
            </View>);
    }
}
export default connect(({ auth, search, active }) => ({ auth, search, active }))(Page);
